/**
 * @author Kiray Tibor
 */
Ext.form.ButtonField = Ext.extend(Ext.form.TextField, {
    buttonText: 'Select...',
    buttonOffset: 3,
    readOnly: true,
    autoSize: Ext.emptyFn,
	valueField: '',
	textField: '',
    selectedText: '',
	selectedValue: '',
    handler: Ext.emptyFn,
	setSelected: function(selectionItems, singleSelect){
		if(singleSelect){
			this.setSelectedValue(selectionItems[0].data[this.valueField]);
			this.setSelectedText(selectionItems[0].data[this.textField]);
		}else{
			tmpSelectedTexts = "";
			tmpSelectedValues = "";
			for(i=0;i<selectionItems.length;i++){
				tmpSelectedTexts += ", " + selectionItems[i].data[this.textField];
				tmpSelectedValues += "," + selectionItems[i].data[this.valueField];
			}
			this.setSelectedValue(tmpSelectedValues.substring(2));
			this.setSelectedText(tmpSelectedTexts.substring(2));
		}
	},
	setSelectedValue: function(newValue){
		this.selectedValue = newValue;
		Ext.get(this.id + '-selected-value').dom.value= newValue;
	},
	setSelectedText: function(newText){
		this.selectedText = newText;
		this.setValue(newText);
	},
	getSelectedValue: function(newValue){
		return this.selectedValue;
	},
	getSelectedText: function(newText){
		return this.selectedText;
	},
    initComponent: function(){
        Ext.form.ButtonField.superclass.initComponent.call(this);
        this.on('focus', this.handler, this);
        this.addEvents(        /**
         * @event fileselected
         * Fires when the underlying file input field's value has changed from the user
         * selecting a new file from the system file selection dialog.
         * @param {Ext.form.FileUploadField} this
         * @param {String} value The file value returned by the underlying file input field
         */
        'actioncomplete');
    },
    onRender: function(ct, position){
        Ext.form.ButtonField.superclass.onRender.call(this, ct, position);
		if (this.selectedText != '') {
			this.setValue(this.selectedText);
		}
        this.wrap = this.el.wrap({
            cls: 'x-button-field-wrap'
        });
        this.el.addClass('x-button-field-text');
        this.el.dom.removeAttribute('name');

        var btnCfg = Ext.applyIf(this.buttonCfg ||
        {}, {
            text: this.buttonText
        });
        this.button = new Ext.Button(Ext.apply(btnCfg, {
            renderTo: this.wrap,
            cls: ' x-button-field-btn ' + (btnCfg.iconCls ? ' x-button-field-icon ' : ''),
        }));
		this.button.on("click", this.handler, this);
        
		this.selectedValueContainer = this.wrap.createChild({
            id: this.id + '-selected-value',
            name: this.name||this.getId(),
            tag: 'input', 
            type: 'hidden',
			value: this.selectedValue
        });
        /*
         this.fileInput.on('change', function(){
         var v = this.fileInput.dom.value;
         this.setValue(v);
         this.fireEvent('actioncomplete', this, v);
         }, this);
         */
    },
    onResize: function(w, h){
        Ext.form.ButtonField.superclass.onResize.call(this, w, h);
        this.wrap.setWidth(w);
        var w = this.wrap.getWidth() - this.button.getEl().getWidth() - this.buttonOffset;
        this.el.setWidth(w);
    },
    // private
    preFocus: Ext.emptyFn,
    // private
    getResizeEl: function(){
        return this.wrap;
    },
    // private
    getPositionEl: function(){
        return this.wrap;
    },
    // private
    alignErrorIcon: function(){
        this.errorIcon.alignTo(this.wrap, 'tl-tr', [2, 0]);
    }
	
});
Ext.reg('buttonfield', Ext.form.ButtonField);
